<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>杨青个人博客网站―一个站在web前段设计之路的女技术员个人博客网站</title>
<meta name="keywords" content="个人博客,杨青个人博客,个人博客模板,杨青" />
<meta name="description" content="杨青个人博客，是一个站在web前端设计之路的女程序员个人网站，提供个人博客模板免费资源下载的个人原创网站。" />
<link href="static/css/base.css" rel="stylesheet">
<link href="static/css/learn.css" rel="stylesheet">
<!--[if lt IE 9]>
<script src="static/js/modernizr.js"></script>
<![endif]-->
</head>
<body>
<header>
  <div id="logo"><a href="/"></a></div>
    <nav class="topnav" id="topnav">
        <a href="index.html"><span>首页</span><span class="en">Protal</span></a>
        <a href="about.html"><span>关于我</span><span class="en">About</span></a>
        <a href="newlist.html"><span>慢生活</span><span class="en">Life</span></a>
        <a href="moodlist.html"><span>碎言碎语</span><span class="en">Doing</span></a>
        <a href="share.html"><span>模板分享</span><span class="en">Share</span></a>
        <a href="knowledge.html"><span>学无止境</span><span class="en">Learn</span></a>
        <a href="book.html"><span>留言版</span><span class="en">Gustbook</span></a>
    </nav>
</header>
<article class="blogs">
<h1 class="t_nav"><span>我们长路漫漫，只因学无止境。 </span><a href="/" class="n1">网站首页</a><a href="/" class="n2">学无止境</a></h1>
<div class="newblog left">
   <h2>仿新浪博客风格・梅――古典个人博客模板</h2>
   <p class="dateview"><span>发布时间：2013-11-04</span><span>作者：杨青</span><span>分类：[<a href="/news/life/">个人博客模板</a>]</span></p>
    <figure><img src="static/images/01.jpg"></figure>
    <ul class="nlist">
      <p>界面设计非原创，出自新浪博客风格・梅作者水云心。在原来的设计上增加了梅花飘落的flash动画。原设计的边界阴影部分用图片实现，本例采用css3新的规则属性，box-shadow</p>
      <a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
    </ul>
    <div class="line"></div>
     <h2>黑色质感时间轴html5个人博客模板</h2>
   <p class="dateview"><span>发布时间：2013-11-04</span><span>作者：杨青</span><span>分类：[<a href="/news/life/">个人博客模板</a>]</span></p>
    <figure><img src="static/images/02.jpg"></figure>
    <ul class="nlist">
      <p>黑色时间轴html5个人博客模板颜色以黑色为主色，添加了彩色作为网页的一个亮点，导航高亮显示、banner图片鼠标划过，可以看到隐藏的文字。css3动画应用在banner和右边“我的名片”个人信息。重点在时间轴部分，三角形和圆形均是css代码写出来的，postion定位，增加页面返回到顶部的代码....</p>
      <a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
    </ul>
    <div class="line"></div>
         <h2>Green绿色小清新的夏天-个人博客模板</h2>
   <p class="dateview"><span>发布时间：2013-11-04</span><span>作者：杨青</span><span>分类：[<a href="/news/life/">个人博客模板</a>]</span></p>
    <figure><img src="static/images/03.jpg"></figure>
    <ul class="nlist">
      <p>这是一个有关Green绿色小清新的夏天的css3 html5绿色个人博客网站模板，导航下面的效果使用了CSS3 Animation 实现对象从右到左渐变的动画效果。</p>
      <a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
    </ul>
    <div class="line"></div>
         <h2>女生清新个人博客网站模板</h2>
   <p class="dateview"><span>发布时间：2013-11-04</span><span>作者：杨青</span><span>分类：[<a href="/news/life/">个人博客模板</a>]</span></p>
    <figure><img src="static/images/04.jpg"></figure>
    <ul class="nlist">
      <p>这是一个html5+css个人博客模板，顶部导航用了css3的gradient背景颜色渐变效果，结合js，对当前栏目高亮显示并且skew水平倾斜的效果。左侧头像也用了css3鼠标放上去滑动出文字的效果...</p>
      <a title="/" href="/" target="_blank" class="readmore">详细信息>></a>
    </ul>
    <div class="line"></div>
    <div class="blank"></div>
    <div class="ad">  
    <img src="static/images/ad.png">
    </div>
    <div class="page"><a title="Total record"><b>41</b></a><b>1</b><a href="/news/s/index_2.html">2</a><a href="/news/s/index_2.html">&gt;</a><a href="/news/s/index_2.html">&gt;&gt;</a></div>
</div>
<aside class="right">
   <div class="rnav">
      <h2>栏目导航</h2>
      <ul>
       <li><a href="/download/" target="_blank">CSS3|Html5</a></li>
       <li><a href="/newsfree/" target="_blank">推荐工具</a></li>
       <li><a href="/newsfree/" target="_blank">心得笔记</a></li>
       <li><a href="/newsfree/" target="_blank">IP查询</a></li>
<li><a href="/newsfree/" target="_blank">JS经典实例</a></li>
<li><a href="/newsfree/" target="_blank">网站建设</a></li>
     </ul>      
    </div>
<div class="news">
<h3>
      <p>最新<span>模板</span></p>
    </h3>
    <ul class="rank">
      <li><a href="/" title="Column 三栏布局 个人网站模板" target="_blank">Column 三栏布局 个人网站模板</a></li>
      <li><a href="/" title="with love for you 个人网站模板" target="_blank">with love for you 个人网站模板</a></li>
      <li><a href="/" title="免费收录网站搜索引擎登录口大全" target="_blank">免费收录网站搜索引擎登录口大全</a></li>
      <li><a href="/" title="做网站到底需要什么?" target="_blank">做网站到底需要什么?</a></li>
      <li><a href="/" title="企业做网站具体流程步骤" target="_blank">企业做网站具体流程步骤</a></li>
      <li><a href="/" title="建站流程篇――教你如何快速学会做网站" target="_blank">建站流程篇――教你如何快速学会做网站</a></li>
      <li><a href="/" title="box-shadow 阴影右下脚折边效果" target="_blank">box-shadow 阴影右下脚折边效果</a></li>
      <li><a href="/" title="打雷时室内、户外应该需要注意什么" target="_blank">打雷时室内、户外应该需要注意什么</a></li>
    </ul>
    <h3 class="ph">
      <p>点击<span>排行</span></p>
    </h3>
    <ul class="paih">
      <li><a href="/" title="Column 三栏布局 个人网站模板" target="_blank">Column 三栏布局 个人网站模板</a></li>
      <li><a href="/" title="withlove for you 个人网站模板" target="_blank">with love for you 个人网站模板</a></li>
      <li><a href="/" title="免费收录网站搜索引擎登录口大全" target="_blank">免费收录网站搜索引擎登录口大全</a></li>
      <li><a href="/" title="做网站到底需要什么?" target="_blank">做网站到底需要什么?</a></li>
      <li><a href="/" title="企业做网站具体流程步骤" target="_blank">企业做网站具体流程步骤</a></li>
    </ul>
    </div>
    <div class="visitors">
      <h3><p>最近访客</p></h3>
      <ul>

      </ul>
    </div>
     <!-- Baidu Button BEGIN -->
    <div id="bdshare" class="bdshare_t bds_tools_32 get-codes-bdshare"><a class="bds_tsina"></a><a class="bds_qzone"></a><a class="bds_tqq"></a><a class="bds_renren"></a><span class="bds_more"></span><a class="shareCount"></a></div>
    <script type="text/javascript" id="bdshare_js" data="type=tools&amp;uid=6574585" ></script> 
    <script type="text/javascript" id="bdshell_js"></script> 
    <script type="text/javascript">
document.getElementById("bdshell_js").src = "http://bdimg.share.baidu.com/static/js/shell_v2.js?cdnversion=" + Math.ceil(new Date()/3600000)
</script> 
    <!-- Baidu Button END -->   
</aside>
</article>
<footer>
  <p>Design by DanceSmile <a href="http://www.miitbeian.gov.cn/" target="_blank">蜀ICP备11002373号-1</a> <a href="/">网站统计</a></p>
</footer>
<script src="js/silder.js"></script>
</body>
</html>